<template>
  <div class="w-[100%]">
    <px-row :gutter="16">
      <px-col :span="12">
        <px-form-item label="开始日期" prop="startTime">
          <px-date-picker
            v-model="formValueInner.startTime"
            :disabled-date="disabledDate"
            format="YYYY-MM-DD"
            value-format="YYYY-MM-DD"
            placeholder="请选择开始日期"
          />
        </px-form-item>
      </px-col>
      <px-col :span="12">
        <px-form-item label="结束日期" prop="endTime">
          <px-date-picker
            v-model="formValueInner.endTime"
            :disabled-date="disabledDate"
            format="YYYY-MM-DD"
            value-format="YYYY-MM-DD"
            placeholder="请选择结束日期"
          />
        </px-form-item>
      </px-col>
    </px-row>
  </div>
</template>
<script setup lang="ts">
import { ref, watch } from "vue";
import { cloneDeep } from "@pureadmin/utils";
type FormValue = {
  execType: string;
  startTime: string;
  endTime: string;
  execDuration: number;
  execDurationUnit: string;
  extendDuration: number;
  extendDurationUnit: string;
  taskCreateTime: string;
  cyclePerNum: number;
  cyclePerUnit: string;
  cycleValue: string;
  cycleTime: string;
};
const props = defineProps<{ formValue: FormValue }>();
const emits = defineEmits(["change"]);
const formValueInner = ref<FormValue>({
  execType: "1", //执行方式 1-固定时间,2-周期时间
  startTime: "",
  endTime: "",
  execDuration: 0,
  execDurationUnit: "",
  extendDuration: 0,
  extendDurationUnit: "",
  cyclePerNum: 0,
  cyclePerUnit: "DAY",
  cycleValue: "",
  cycleTime: "",
  taskCreateTime: ""
});
watch(
  () => props.formValue,
  () => {
    formValueInner.value = mergeAndCloneObjects(formValueInner.value, props.formValue);
  },
  { immediate: true, deep: true }
);
watch(
  formValueInner,
  () => {
    emits("change", cloneDeep(formValueInner.value));
  },
  { deep: true }
);
function mergeAndCloneObjects(obj1, obj2) {
  const newObj = {};

  for (let key in obj1) {
    if (obj2.hasOwnProperty(key)) {
      newObj[key] = obj2[key];
    }
  }

  return cloneDeep(newObj);
}
const disabledDate = (time: Date) => {
  const oDate = new Date();
  let oYear = oDate.getFullYear();
  let oMonth = oDate.getMonth();
  if (oMonth === 0) {
    oYear -= 1;
    oMonth = 12;
  }
  const oTime = new Date(`${oYear}/${oMonth}/1`).getTime();
  return time.getTime() < oTime; // 禁用上个月1号之前的日期
};
</script>
